<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">
	<title>比比旅行</title>
	<link rel="stylesheet" href="${ctxPath}/static/payCss/confirmPayment.css" type="text/css" />
	<!--<link rel="stylesheet" href="confirmPayment.css" type="text/css" />-->
	<script>
		(function(designWidth, maxWidth) {
			var doc = document,
					win = window;
			var docEl = doc.documentElement;
			var metaEl,
					metaElCon;
			var styleText,
					remStyle = document.createElement("style");
			var tid;
			function refreshRem() {
				// var width = parseInt(window.screen.width); // uc有bug
				var width = docEl.getBoundingClientRect().width;
				if (!maxWidth) {
					maxWidth = 540;
				};
				if (width > maxWidth) { // 淘宝做法：限制在540的屏幕下，这样100%就跟10rem不一样了
					width = maxWidth;
				}
				var rem = width * 100 / designWidth;
				// var rem = width / 10; // 如果要兼容vw的话分成10份 淘宝做法
				//docEl.style.fontSize = rem + "px"; //旧的做法，在uc浏览器下面会有切换横竖屏时定义了font-size的标签不起作用的bug
				remStyle.innerHTML = 'html{font-size:' + rem + 'px;}';
			}

			// 设置 viewport ，有的话修改 没有的话设置
			metaEl = doc.querySelector('meta[name="viewport"]');
			// 20171219修改：增加 viewport-fit=cover ，用于适配iphoneX
			metaElCon = "width=device-width,initial-scale=1,maximum-scale=1.0,user-scalable=no,viewport-fit=cover";
			if(metaEl) {
				metaEl.setAttribute("content", metaElCon);
			}else{
				metaEl = doc.createElement("meta");
				metaEl.setAttribute("name", "viewport");
				metaEl.setAttribute("content", metaElCon);
				if (docEl.firstElementChild) {
					docEl.firstElementChild.appendChild(metaEl);
				}else{
					var wrap = doc.createElement("div");
					wrap.appendChild(metaEl);
					doc.write(wrap.innerHTML);
					wrap = null;
				}
			}
			//要等 wiewport 设置好后才能执行 refreshRem，不然 refreshRem 会执行2次；
			refreshRem();
			if (docEl.firstElementChild) {
				docEl.firstElementChild.appendChild(remStyle);
			} else {
				var wrap = doc.createElement("div");
				wrap.appendChild(remStyle);
				doc.write(wrap.innerHTML);
				wrap = null;
			}
			win.addEventListener("resize", function() {
				clearTimeout(tid); //防止执行两次
				tid = setTimeout(refreshRem, 300);
			}, false);

			win.addEventListener("pageshow", function(e) {
				if (e.persisted) { // 浏览器后退的时候重新计算
					clearTimeout(tid);
					tid = setTimeout(refreshRem, 300);
				}
			}, false);

			if (doc.readyState === "complete") {
				doc.body.style.fontSize = "16px";
			} else {
				doc.addEventListener("DOMContentLoaded", function(e) {
					doc.body.style.fontSize = "16px";
				}, false);
			}
		})(750, 750);
	</script>

</head>
<body class="my">
<div class="header">
	<a class="rers" href="${backUrl}"> <div class="return" onclick="goreturn();"> </div></a>确认支付
</div>
<div class="box_a">
	<div class="box_a_1">
		<div class="box_a_11"><span class="box_font">订单总额</span></div>
		<div class="box_a_12"><span class="box_subscription">￥${payVo.cnyAmount}</span></div></div>
</div>
<div class="box_b"><span class="box_font">选择支付方式</span></div>
<!--<div class="box_c">
	<div class="box_c_1"> <div class="box_c_img"><img src="https://itjh.oss-cn-beijing.aliyuncs.com/PageMap/HTL.png"></img></div> </div>
	<div class="box_c_2">
		<div class="box_c_21"><p class="box_c_f">HTL支付</p></div>
		<div class="box_c_22"><p class="box_c_x">可用余额：<span class="box_c_xs">900</span></p></div>
	</div>
	<div class="box_c_4">
		<div class="box_c_41"><p class="box_c_4f">需支付<span class="box_font_s">0.00235</span>HTL</p></div>
		<div class="box_c_42"><p class="box_c_4x">(1ETH≈¥<span class="box_c_4xs">900.000</span>)</p></div>
	</div>
	<div class="box_c_3">
		<input value="1" type="radio" name="radio" class="box_int" remainPart="100" echoAmount="200"></input>
		<div class="box_c_a">
		</div>
	</div>
</div>-->

@for(coin in payVo.coins){
<div class="box_c">
	<div class="box_c_1"> <div class="box_c_img"><img src="https://itjh.oss-cn-beijing.aliyuncs.com/PageMap/${coin.unit}.png"></div> </div>
	<div class="box_c_2">
		<div class="box_c_21"><p class="box_c_f">${coin.remark}</p></div>
		<div class="box_c_22"><p class="box_c_x">可用余额：<span class="box_c_xs">${coin.remainPart}</span></p></div>
	</div>
	<div class="box_c_4">
		<div class="box_c_41"><p class="box_c_4f">需支付<span class="box_font_s">${coin.echoAmount}</span>${coin.unit}</p></div>
		@if(coin.unit=="ETH"){
		<div class="box_c_42"><p class="box_c_4x">(1ETH ≈ ¥<span class="box_c_4xs">${coin.rate}</span>)</p></div>
		@}
		@if(coin.unit=="GUSD"){
		<div class="box_c_42"><p class="box_c_4x">(1GUSD ≈ ¥<span class="box_c_4xs">${coin.rate}</span>)</p></div>
		@}
	</div>
	<div class="box_c_3">
        @if(coinLP.index==1){
		<input value="${coinLP.index}" type="radio" name="radio" class="box_int" channel="${coin.currency}" remainPart="${coin.remainPart}" echoAmount="${coin.echoAmount}" checked/>
        <div class="box_c_a">
        </div>
        @}
        @else{
		<input value="${coinLP.index}" type="radio" name="radio" class="box_int" channel="${coin.currency}" remainPart="${coin.remainPart}" echoAmount="${coin.echoAmount}"/>
        <div class="box_c_not">
        </div>
        @}
	</div>
</div>
@}
<div class="box_d">
	<div class="box_d_1"><span class="box_d_span">确认支付</span></div>
	<input type="hidden" value="${userId}" id="userId">
	<input type="hidden" value="${apiUri}" id="apiUri">
</div>
<div class="box_f">
	<div class="box_f_1">
		<div class="box_f_2">提示<img class="close" src="https://itjh.oss-cn-beijing.aliyuncs.com/PageMap/x.png" /></div>
		<div class="box_f_3">
			<p>您还没通过实名认证，通过认证后才能使用此功能。</p>
		</div>
		<div class="box_f_4">去认证</div>
	</div>
</div>
<script src="https://itjh.oss-cn-beijing.aliyuncs.com/static/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
	$(document).ready(function () {
        var wx5 = /x5app/.test(navigator.userAgent) && !window.MSStream;
        if(!wx5){
            $(".my").css("margin-top","0");
        };
    })
    $("input[type='radio']").click(function(){
		$("input[type='radio']").removeAttr("checked");
		$(this).attr("checked","checked");
        var val_r = $(this).val();
        $(".box_c_a").addClass("box_c_not");
        $(".box_c_a").removeClass("box_c_a");
        $(this).siblings().addClass("box_c_a");
        $(this).siblings().removeClass("box_c_not");
    });
    var userid = $("#userId").val();
    $(".box_d_1").click(function (){
    	//判断支付余额不足
		var  currency=$("input[type='radio']:checked").attr('channel');// 通正方式
        var  remainPart=$("input[type='radio']:checked").attr('remainPart'); //余额
        var  echoAmount=$("input[type='radio']:checked").attr('echoAmount'); //订单总额
        if( parseFloat(remainPart - echoAmount) <0){
            simpleHints(currency.toUpperCase()+"余额不足,请选择其他支付方式");
            return ;
        }

        $.ajax({
            url:'${apiUri}api/distinguish/validate',
            type:"post",
            data:{user_id:userid},
            success:function (data) {
                // window.location.href="payconfirm";
                if(currency==='htl'&&data.flag == 2){
                    simpleHints('实名认证信息审核中，请耐心等待');
                    window.location.href="${backUrl}";
                }else if(currency==='htl'&&data.flag != 1){  //未通过验证
                    $(".box_f").show();
                }else{
                    $.ajax({
                        url:'${apiUri}api/user/selectUserPayPasswordState',
                        type:"GET",
                        data:{userId:userid,ran:Math.random()},
                        success:function (data) {
                            if (data.erroCode == 1) {
                                $.ajax({
                                    url:'${apiUri}version/get?client=H5&ran='+Math.random(),
                                    type:'GET',
                                    success:function(data){
                                        if(data&&data.erroCode==0){
                                            if(data.data.version){
                                                var version = data.data.version;
                                                var urlRex = location.href;
                                                var url = 'https://${bibiUriPrefix}.bibi321.com/'+version+'/cardbox/setJyPassword.w?='+urlRex;
                                                window.location.href= url;
                                            }else{
                                                simpleHints('没有版本号数据');
                                            }
                                        }else{
                                            simpleHints('获取版本号接口报错');
                                        }
                                    }
                                });
                            }else {
								// var val_r=$("input[type='radio'][checked]").val();
								// var channel='htl';
								// if(val_r==2){
								// 	channel='eth';
								// }else if(val_r==3){
								// 	channel='gusd';
								// }
                                window.location.href="payconfirm?channel="+currency+"&r="+Math.random();
                            }
                        }
                    });
                }
            }
        })
    });
    // $.ajax({
    //     url:'${apiUri}api/distinguish/validate',
    //     type:"post",
    //     data:{user_id:userid},
    //     success:function (data) {
    //         if(data.flag == 2){
    //             simpleHints('实名认证信息审核中，请耐心等待');
    //             window.history.back(-1);
    //         }else if(data.flag != 1){  //未通过验证
    //             $(".box_f").show();
    //         }
    //     }
    // })
    $(".box_f_4").click(function(){
        $.ajax({
            url:'${apiUri}version/get?client=H5&ran='+Math.random(),
            type:'GET',
            success:function(data){
                if(data&&data.erroCode==0){
                    if(data.data.version){
                        var version = data.data.version;
                        var urlRex = location.href;
                        var url = 'https://${bibiUriPrefix}.bibi321.com/'+version+'/cardbox/verifyRealName.w?fromUrl='+urlRex;
                        window.location.href= url;
                    }else{
                        simpleHints('没有版本号数据');
                    }
                }else{
                    simpleHints('获取版本号接口报错');
                }
            }
        })
    });
    $(".close").click(function(){
        $(".box_f").hide();
        window.history.back(-1);
    });
    function simpleHints(obj) {
        $("body").append($("<div id='prompt'></div>"));
        document.getElementById("prompt").innerHTML = obj;
        document.getElementById("prompt").style.display = "block";
        setTimeout('document.getElementById("prompt").style.display= "none";', 1500)
    }
</script>
</body>
</html>